<template>
  <div>
    <el-table :data="orderList" style="width: 100%">
      <el-table-column :show-overflow-tooltip="true" prop="id" label="ID" width="110px" />
      <el-table-column prop="" label="就诊时间" width="180">
        <template #default="{ row }">
          <span>{{ row.fetchTime }}</span>
        </template>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="hosname" label="医院" width="110px" />
      <el-table-column :show-overflow-tooltip="true" prop="depname" label="科室" />
      <el-table-column :show-overflow-tooltip="true" prop="title" label="医生" width="110px" />
      <el-table-column :show-overflow-tooltip="true" prop="amount" label="服务费" width="80px" />
      <el-table-column
        :show-overflow-tooltip="true"
        prop="patientName"
        label="就诊人"
        width="80px" />
      <el-table-column :show-overflow-tooltip="true" prop="patientName" label="状态">
        <template #default="{ row }">
          <span>{{ row.param.orderStatusString }}</span>
        </template>
      </el-table-column>
      <el-table-column
        :show-overflow-tooltip="true"
        prop="patientName"
        label="详情"
        align="center"
        width="90px">
        <template #default="{ row }">
          <el-button type="primary" plain size="mini" @click="goDetail(row)">详情</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script lang="ts" setup>
import { useRouter } from 'vue-router'
import { orderDetail } from '@/api/order/type'
const $router = useRouter()

defineProps(['orderList'])

// 跳转详情
const goDetail = (item: orderDetail) => {
  $router.push({
    path: '/user/order',
    query: {
      id: item.id
    }
  })
}
</script>

<style lang="scss" scoped></style>
